<template>
	<view>
		
		<!-- 归属店铺 -->
		<view>
			<view class="edit-info-box">
				<text class="info-name">店铺归属</text>
				<text class="uni-input info-content info-content-frist">{{old_beblong_info.code== '' ? '暂无店铺归属' : '('+ old_beblong_info.code +')' + old_beblong_info.site_name}}</text>

			</view>
			<view class="edit-info-box">
				<text class="info-name">店铺编号</text>
				<input class="uni-input info-content" placeholder="请输入店铺编号" v-model="new_belong_info.code" />
				<picker @change="bindPickerChange" :value="index" :range="shopList" range-key="site_name">
					<text class="desc uni-input"></text>
					<button type="primary" class="dynacode">附近商铺</button>
				</picker>
			</view>

			<view class="edit-info-box-end" @click="choiceSiteNameSave">
				<button type="primary">绑定</button>
			</view>


		</view>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				ascriptionInfo: {
					code: '',
					site_name: ''
				},
				old_beblong_info: {
					code: '',
					site_name: ''
				},
				new_belong_info: {
					code: '',
					site_name: ''
				},
				shopList: [],

				index: 0,
				lng: '116.23',
				lat: '39.54'
			}
		},
		computed: {
			//vueX页面主题
			themeStyle() {
				return 'theme-' + this.$store.state.index.themeStyle
			},
			accountType() {
				let arr = Object.keys(this.ascriptionInfo);
				let index = 0;
				if (!arr.length) {
					return index
				} else {
					for (let i = 0; i < arr.length; i++) {
						if (arr[i] == this.ascriptionInfo.withdraw_type) {
							index = i;
						}
					}
					return index
				}
			}
		},

		onShow() {
			// 刷新多语言
			// this.$langConfig.refresh();
			this.getBelongShopInfo();
			this.getShopList();
		},
		methods: {
			// 获取
			getBelongShopInfo() {
				this.$api.sendRequest({
					url: '/api/member/getBelongShopInfo',
					success: res => {
						console.log(res);
						this.old_beblong_info.code = res.data.code;
						this.old_beblong_info.site_name = res.data.site_name;
					}
				});
			},
			/**
			 * 获取店铺街方式
			 */
			getShopList() {
				// 经纬度
				uni.getLocation({
					type: 'gcj02',
					success: (res) => {
						this.lng = res.longitude;
						this.lat = res.latitude;
						this.$api.sendRequest({
							url: '/api/shop/page',
							data: {
								page: 1,
								page_size: 10,
								order: 'distance',
								sort: 'asc',
								belong_right: 1,
								// 经纬度
								lng: this.lng,
								lat: this.lat
							},
							success: res => {
								if (res.code >= 0 && res.data) {
									let list = res.data.list;
									this.shopList = res.data.list;
								}
							}
						});
					},
					fail:(res) => {
						console.log('获取经纬度失败', res);
					},
				});
				
				
			},
			/**
			 * 选择店铺列表
			 */
			bindPickerChange: function(e) {
				this.index = e.detail.value
				this.new_belong_info.site_name = this.shopList[e.detail.value].site_name
				this.new_belong_info.code = this.shopList[e.detail.value].code
			},
			// 绑定
			choiceSiteNameSave() {
				let that = this;
				if (that.new_belong_info.code == '') {
					that.$util.showToast({
						title: '请输入商铺编号',
					});
					return
				}
				
				that.$api.sendRequest({
					url: '/api/member/getBelongShopInfoByCode',
					data: {
						code: that.new_belong_info.code,
					},
					success: res => {
						if (res.code < 0) {
							that.$util.showModal({
								title: res.message,
							});
							return;
						} 
						
						let shop_info = res.data;
						if(!shop_info){
							that.$util.showModal({
								title: '店铺有误',
							});
							return;
						}
						
						uni.showModal({
							title: '提示',
							content: `确定要归属【${shop_info.site_name}】吗？`,
							success: function(res) {
								if (res.confirm) {
									that.$api.sendRequest({
										url: '/api/member/belongShop',
										data: {
											code: that.new_belong_info.code,
										},
										success: res => {
											that.$util.showToast({
												title: res.message,
											});
											if(res.code >= 0){
												setTimeout(function(){
													that.$util.redirectTo('/pages/member/index/index', {}, 'reLaunch');
												}, 1000);
											}
										},
						
									});
								} else if (res.cancel) {}
							}
						});

					}
				});
			},
		},

	}
</script>

<style lang="scss" scoped>
	.info-list-cell {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20rpx 40rpx;
		position: relative;
		line-height: 50rpx;
		background-color: #fff;

		&.log-out-btn {
			margin-top: 40rpx;

			.cell-tit {
				margin: auto;
			}
		}


		&.info-item {
			margin-top: 16rpx;
		}

		&.info-list-con:after {
			content: '';
			position: absolute;
			left: 30rpx;
			right: 30rpx;
			bottom: 0;
			border-bottom: 1px solid $ns-bg-color-gray;
		}

	}

	.edit-info-box {
		margin-top: 20rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 20rpx 40rpx;
		min-height: 50rpx;
		background-color: #fff;

		.info-name {
			width: 180rpx;
			font-size: $ns-font-size-base;
			text-align: left;
		}

		.info-content {
			&:first-of-type {
				width: auto !important;
			}

			margin-right: auto;
			width: 300rpx;
			font-size: $ns-font-size-base;
			padding: 0;

		}

		.info-content-frist {
			margin-left: -17px !important;
		}

		.dynacode {
			margin: 0;
			padding: 0 10rpx;
			width: 250rpx;
			height: 60rpx;
			font-size: $ns-font-size-base;
			line-height: 60rpx;
			color: #fff;
			word-break: break-all;
		}
		

	}

	.pick_wid {
		width: 200rpx;
	}
	uni-button {
	    margin: 0 30px;
	    font-size: 14px;
	    border-radius: 20px;
	    line-height: 2.7;
	    margin-top: 15px;
	}
</style>
